<template>
    <div class="left">
        <div>核心设置</div>
        <ul>
            <li @click="toRouter('/menu')">菜单管理</li>
            <!-- <li @click="toRouter('/shezhi')">站点设置</li>
            <li @click="toRouter('/chucun')">缓存管理</li>
            <li @click="toRouter('/danye')">单页管理</li>
            <li @click="toRouter('/lanmu')">栏目管理</li>
            <li @click="toRouter('/liandong')">联动菜单</li> -->
        </ul>
    </div>
    <div class="right">
        <router-view></router-view>
    </div>
</template>

<script setup>
import { useRouter } from 'vue-router';
const router = useRouter();

const toRouter = (path) => {
    router.push(path)
}
</script>

<style lang="scss" scoped>
 .left{
        background-color: #313131;
        height: 100%;
        width: 130px;
        color: #ffffff;
        text-align: center;
        div{
            padding: 20px 0;
            border-bottom: 1px solid #c2c2c2;
        }
        ul{
            li{
                padding: 5px 0;
                &:hover{
                    cursor: pointer;

                }
            }
        }
    }

.right {
    background-color: #ffffff;
    height: 100%;
    width: calc(100% - 130px);
}
</style>